<template>
    <div v-if="detailsVisible">
        <el-collapse v-model="activeNames"  accordion>
            <el-collapse-item  name="1">
                <template slot="title">{{typeB}} {{typeChild}} 历次记录<i class="header-icon el-icon-info" style="margin-left: 10px;"></i></template>
                <lcjl ref="lcjl" v-on:serchrecorde="serchrecorde" v-on:serchfile="dbFilerecode" v-on:changetypeChild="changetypeChild" v-on:gettab="gettab"></lcjl>
            </el-collapse-item>
            <el-collapse-item  name="2" class="huanjiexuanju_file" v-show="disabledTwo"> 
                <template slot="title">
                  {{typeB}} 相关文件
                    <Badge dot v-if="hasnewfile==true">
                        <Icon type="ios-albums"  style="margin-left: 10px;"></Icon>
                    </Badge>
                    <Icon type="ios-albums"  style="margin-left: 10px;" v-if="hasnewfile==false"></Icon>
                </template>
                <showfiles ref="showfiles" :Tabs="Tabs"></showfiles>
            </el-collapse-item>
        </el-collapse>

    </div>
</template>
<script>
    import {mapActions} from 'vuex';
    export default {
        props:{
            columnsIn:null,
        },
        data: () => ({
            detailsVisible:false,
            activeNames:'1',
            disabledTwo:false,
            typeA:'',
            typeB:'',
            hasnewfile:false,
            Tabs:[],
            typeChild:'',
            Clear:false, //重置，
            columns:{
                normal:[
                    {
                        prop:'time',
                        width:'155',
                        label:'来文时间',
                    },
                    {
                        prop:'bianhao',
                        width:'155',
                        label:'文件编号',
                    },
                    {
                        prop:'name',
                        width:'155',
                        label:'文件名称',
                    },
                    {
                        prop:'jieguo',
                        width:'155',
                        label:'办理结果',
                    },
                    {
                        prop:'store',
                        width:'125',
                        label:'实际存放',
                    },
                ],
                showstatus:{
                    show:true,
                    prop:'status',
                    width:'125',
                    label:'办理状态',
                },
                showcontent:{
                    show:true,
                    prop:'content',
                    width:'125',
                    label:'内容查看',
                },
                showdownload:{
                    show:true,
                    prop:'truesrc',
                    width:'125',
                    label:'内容下载',
                }
            },
        }),
        watch: {
            "detailsVisible": {
                handler(n) {
                    if(this.detailsVisible==true)
                    {
                        let _this=this;
                        setTimeout(function () {
                            _this.$refs.lcjl.$data.typeA=_this.typeA;
                            _this.$refs.lcjl.$data.typeB=_this.typeB;
                            _this.$refs.lcjl.$data.samedwdzb=false;
                        }, 100)
                    }
                },
                deep: true
            }, 
            "filerecordes": {
                handler(n) {
                    if(this.filerecordes.length>0){
                    }
                    else
                    {
                        this.disabledTwo=false;
                    }
                },
                deep: true
            }, 
            "Clear": {
                handler(n) {
                    if(n){
                        console.log(" clearing...");
                        this.activeNames='1';
                        this.disabledTwo=false;
                        this.Clear=false;
                        let _this=this;
                        setTimeout(function(){
                            if( _this.$refs.lcjl){
                                _this.$refs.lcjl.$data.filerecordes=[];
                            }
                            if( _this.$refs.showfiles){
                                _this.$refs.showfiles.$data.Filerecode="";
                            }
                        },200)
                    }
                },
                deep: true
            }, 
        },
        mounted() {
            this.$Common.Config.this = this;
            if (this.GetUser() == false) {
                this.$router.push("/");
            }
            
        },
        methods: {
            ...mapActions(['GetUser', 'GetTabs']),
            serchrecorde(data){
                this.filerecordes=data;
            },
            dbFilerecode(data){
                this.disabledTwo=true;
                this.activeNames='2';
                this.$refs.showfiles.$data.Filerecode=data;
                this.$refs.showfiles.$data.Tabs=this.Tabs;
                if(this.columnsIn==null){
                    this.$refs.showfiles.$data.columns=this.columns;
                }
                else{
                    this.$refs.showfiles.$data.columns=this.columnsIn;
                }
                
            },
            changetypeChild(typeChild){
                this.typeChild=typeChild;
            },
            gettab(typeBB){
                let _this=this;
                this.GetTabs(this.typeA+'-'+typeBB)//去后台获取当前dwid dzbid的在当前的tabs
                .then(function(value){
                    _this.Tabs=value.Ltabs;
                    
                })
            },
        }
    }
</script>
<style>
</style>